<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>供应商</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
    <script type="text/javascript" src="../../../res/js/jquery-3.4.1.min.js"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->

</head>
<body style="padding: 5px;">
<form class="layui-form" action="" method="post" lay-filter='myform'
      id="myform">
    <div class="layui-form-item">
        <div class="layui-form-inline">
            <label class="layui-form-label" style="width: 100px;">公司名称:</label>
            <div class="layui-input-inline">
                <input type="text" name="supName" id="supName" autocomplete="off"
                       class="layui-input">
            </div>
            <div class="layui-form-inline">
                <label class="layui-form-label" style="width: 100px;">公司电话:</label>
                <div class="layui-input-inline">
                    <input type="text" name="supPhone" id="supPhone" autocomplete="off"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-inline">
                <input type="button" class="layui-btn layui-btn-sm"
                       onclick="querys()" value="查询">
            </div>
        </div>
    </div>
</form>
<table class="layui-hide" id="test" lay-filter="test"></table>

<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="checkeddelete">选中的删除</button>
        <button class="layui-btn layui-btn-sm" lay-event="insert">增加</button>

    </div>
</script>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="update">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="../../../res/layui/layui.js" charset="utf-8"></script>
<script src="../../../res/js/util.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->

<script>
    var openIndex = null;
    var table = null;
    layui.use('table', function() { 0
        table = layui.table;
        form = layui.form;
        //渲染
        table.render({
            elem : '#test',
            url : getRootPath()+'hqSupplier/showAll',
            method:'post',
            toolbar : '#toolbarDemo', //开启头部工具栏，并为其绑定左侧模板

            // defaultToolbar : [ 'filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
            //     title : '提示',
            //     layEvent : 'LAYTABLE_TIPS',
            //     icon : 'layui-icon-tips'
            // } ],
            defaultToolbar:false,
            title : '用户数据表',
            cols : [ [ {
                type : 'checkbox',
                fixed : 'left'
            }, {
                field : 'supId',
                title : '供应商id',
                width : 80,
                fixed : 'left',
                type : 'numbers',
                align:'center'
            }, {
                field : 'supName',
                title : '公司名称',
                width : 120,
                align:'center'
            }, {
                field : 'supPhone',
                title : '电话',
                width : 120,
                align:'center'
            }, {
                field : 'supLinkman',
                title : '联系人',
                width : 170,
                align:'center'
            }, {
                field : 'address',
                title : '供应商地址',
                width : 170,
                align:'center'
            }, {
                field : 'oper',
                title : '操作人',
                width : 170,
                align:'center'
            }, {
                field : 'ramark',
                title : '备注',
                width : 170,
                align:'center'
            },{
                field : 'optime',
                title : '操作时间',
                width : 170,
                align:'center'
            },{
                fixed : 'right',
                title : '操作',
                toolbar : '#barDemo',
                width : 140,
                align:'center'
            }
            ] ],
            page : true
        });

        //头工具栏事件
        table.on('toolbar(test)', function(obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'getCheckData':
                    var data = checkStatus.data;
                    layer.alert(JSON.stringify(data));
                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    layer.msg('选中了：' + data.length + ' 个');
                    break;
                case 'isAll':
                    layer.msg(checkStatus.isAll ? '全选' : '未全选');
                    break;
                //多选删除
                case 'checkeddelete':
                    var data = checkStatus.data;
                    if (data.length == 0) {
                        layer.msg("请至少选择一条数据")
                        return;
                    } else {
                        var a=new Array();
                        for (i = 0; i < data.length; i++) {
                            console.info(data[i].supId)
                            a.push(data[i].supId) //加入_ 成字符串
                        }
                        var s=a.join(",");
                        layer.confirm('真的要全部删除吗', function(index) {
                            var url = getRootPath()+'hqSupplier/delete';
                            var dataParameter = {
                                id : s
                            }
                            $.ajax({
                                asyn : true,
                                type : "delete",
                                url : url,
                                data : dataParameter,
                                success : function(res) {
                                    console.info(res)
                                    if (res.status == 20) {
                                        layer.msg(res.message);
                                        table.reload('test'); //刷新表格
                                    } else {
                                        layer.msg(res.message);
                                    }
                                    obj.del();
                                },
                                error : function(fh) {
                                    layer.msg(res.message);
                                }
                            },"json");
                        });
                    }
                    break;
                case 'insert':
                    openIndex = layer.open({
                        type : 2,
                        skin : 'layui-layer-rim', //加上边框
                        area : [ '520px', '540px' ], //宽高
                        title : '增加用户表',
                        maxmin : true, //开 启最大化最小化按钮
                        content : 'supplierinsert.html',
                        end : function() {
                        }
                    });

                    break;
                //自定义头工具栏右侧图标 - 提示
                case 'LAYTABLE_TIPS':
                    layer.alert('这是工具栏右侧自定义的一个图标按钮');
                    break;
            }
            ;
        });

        //监听行工具事件
        table.on('tool(test)', function(obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('真的删除行么', function(index) {
                    var url = getRootPath()+'hqSupplier/delete';
                    var dataParameter = {
                        id : data. supId
                    }
                    $.ajax({
                        asyn : true,
                        type : "delete",
                        url : url,
                        data : dataParameter,
                        success : function(res) {
                            console.info(res)
                            if (res.status == 20) {
                                layer.msg(res.message);
                                table.reload('idTest'); //刷新表格
                            } else {
                                layer.msg(res.message);
                            }
                            obj.del();
                        },
                        error : function(fh) {
                            layer.msg(res.message);
                        }
                    },"json");
                    layer.close(index);
                });
            } else if (obj.event === 'update') {
                var id = data.supId;
                openIndex = layer.open({
                    type : 2,
                    skin : 'layui-layer-rim', //加上边框
                    area : [ '520px', '550px' ], //宽高
                    title : '修改用户表',
                    maxmin : true, //开启最大化最小化按钮
                    content : 'supplierinsert.html?supId=' + id,//传入id
                    end : function() {

                    }
                });
            }
        });
    });
    /**
     * 关闭层
     */
    function closeOpen(msg) {
        layer.close(openIndex);

        layer.msg(msg, {time : 1500})
        table.reload("test");//刷新表格
    }
    /**
     * 点击取消
     */
    function quxiao(){
        layer.close(openIndex);
    }
    function query(){
        table.reload('test',{
            where:{
                supName:$("#supName").val()
            },
            page:{
                curr:1
            }
        })
    }
    function querys(){
        table.reload('test',{
            where:{
                supPhone:$("#supPhone").val(),
                supName:$("#supName").val()
            },
            page:{
                curr:1
            }
        })
    }
</script>

</body>
</html>